﻿<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="../assets/css/yui-cssgrids-min.css">
    <link rel="stylesheet" href="../assets/vendor/prettify/prettify-min.css">
    <link rel="stylesheet" href="../assets/css/main.css" id="site_styles">
    <link rel="shortcut icon" type="image/x-icon" href="../assets/favicon.ico">
    <script src="../assets/js/yui-source.js"></script>
	<title>EaselJS v1.0.0 API Documentation : Graphics</title>
</head>
<body class="yui3-skin-sam">

<div id="doc">
    <div id="hd" class="yui3-g header">
        <div class="yui3-u-3-4">
            
                <h1><a href="http://createjs.site/easeljs"><img src="../assets/docs-icon-EaselJS.png" title="EaselJS"></a></h1>
            
        </div>
        <div class="version">
            <em>API Documentation for: 1.0.0</em>
        </div>
    </div>
    <div id="bd" class="yui3-g">

        <div class="yui3-u-1-4">
            <div id="docs-sidebar" class="sidebar apidocs">
                <div id="api-list">
    <h2 class="off-left">APIs</h2>
    <div id="api-tabview" class="tabview">
        <ul class="tabs">
            <li><a href="#api-classes">Classes</a></li>
        </ul>

        <div id="api-tabview-filter">
            <input type="search" id="api-filter" placeholder="Type to filter APIs">
        </div>

        <div id="api-tabview-panel">
            <ul id="api-classes" class="apis classes">
            
                <li><a href="AlphaMapFilter.html">AlphaMapFilter</a></li>
            
                <li><a href="AlphaMaskFilter.html">AlphaMaskFilter</a></li>
            
                <li><a href="Bitmap.html">Bitmap</a></li>
            
                <li><a href="BitmapCache.html">BitmapCache</a></li>
            
                <li><a href="BitmapText.html">BitmapText</a></li>
            
                <li><a href="BlurFilter.html">BlurFilter</a></li>
            
                <li><a href="ButtonHelper.html">ButtonHelper</a></li>
            
                <li><a href="ColorFilter.html">ColorFilter</a></li>
            
                <li><a href="ColorMatrix.html">ColorMatrix</a></li>
            
                <li><a href="ColorMatrixFilter.html">ColorMatrixFilter</a></li>
            
                <li><a href="Container.html">Container</a></li>
            
                <li><a href="DisplayObject.html">DisplayObject</a></li>
            
                <li><a href="DisplayProps.html">DisplayProps</a></li>
            
                <li><a href="DOMElement.html">DOMElement</a></li>
            
                <li><a href="EaselJS.html">EaselJS</a></li>
            
                <li><a href="Event.html">Event</a></li>
            
                <li><a href="EventDispatcher.html">EventDispatcher</a></li>
            
                <li><a href="Filter.html">Filter</a></li>
            
                <li><a href="Graphics.html">Graphics</a></li>
            
                <li><a href="Graphics.Arc.html">Graphics.Arc</a></li>
            
                <li><a href="Graphics.ArcTo.html">Graphics.ArcTo</a></li>
            
                <li><a href="Graphics.BeginPath.html">Graphics.BeginPath</a></li>
            
                <li><a href="Graphics.BezierCurveTo.html">Graphics.BezierCurveTo</a></li>
            
                <li><a href="Graphics.Circle.html">Graphics.Circle</a></li>
            
                <li><a href="Graphics.ClosePath.html">Graphics.ClosePath</a></li>
            
                <li><a href="Graphics.Ellipse.html">Graphics.Ellipse</a></li>
            
                <li><a href="Graphics.Fill.html">Graphics.Fill</a></li>
            
                <li><a href="Graphics.LineTo.html">Graphics.LineTo</a></li>
            
                <li><a href="Graphics.MoveTo.html">Graphics.MoveTo</a></li>
            
                <li><a href="Graphics.PolyStar.html">Graphics.PolyStar</a></li>
            
                <li><a href="Graphics.QuadraticCurveTo.html">Graphics.QuadraticCurveTo</a></li>
            
                <li><a href="Graphics.Rect.html">Graphics.Rect</a></li>
            
                <li><a href="Graphics.RoundRect.html">Graphics.RoundRect</a></li>
            
                <li><a href="Graphics.Stroke.html">Graphics.Stroke</a></li>
            
                <li><a href="Graphics.StrokeDash.html">Graphics.StrokeDash</a></li>
            
                <li><a href="Graphics.StrokeStyle.html">Graphics.StrokeStyle</a></li>
            
                <li><a href="Matrix2D.html">Matrix2D</a></li>
            
                <li><a href="MouseEvent.html">MouseEvent</a></li>
            
                <li><a href="MovieClip.html">MovieClip</a></li>
            
                <li><a href="MovieClipPlugin.html">MovieClipPlugin</a></li>
            
                <li><a href="Point.html">Point</a></li>
            
                <li><a href="Rectangle.html">Rectangle</a></li>
            
                <li><a href="Shadow.html">Shadow</a></li>
            
                <li><a href="Shape.html">Shape</a></li>
            
                <li><a href="Sprite.html">Sprite</a></li>
            
                <li><a href="SpriteSheet.html">SpriteSheet</a></li>
            
                <li><a href="SpriteSheetBuilder.html">SpriteSheetBuilder</a></li>
            
                <li><a href="SpriteSheetUtils.html">SpriteSheetUtils</a></li>
            
                <li><a href="Stage.html">Stage</a></li>
            
                <li><a href="StageGL.html">StageGL</a></li>
            
                <li><a href="Text.html">Text</a></li>
            
                <li><a href="Ticker.html">Ticker</a></li>
            
                <li><a href="Touch.html">Touch</a></li>
            
                <li><a href="UID.html">UID</a></li>
            
                <li><a href="Utility%20Methods.html">Utility Methods</a></li>
            
                <li><a href="VideoBuffer.html">VideoBuffer</a></li>
            
                <li><a href="WebGLInspector.html">WebGLInspector</a></li>
            
            </ul>

            <ul id="api-modules" class="apis modules">
            
                <li><a href="../modules/CreateJS.html">CreateJS</a></li>
            
                <li><a href="../modules/EaselJS.html">EaselJS</a></li>
            
            </ul>
        </div>
    </div>
</div>

            </div>
        </div>
        <div class="yui3-u-3-4">
            <div id="api-options">
        Show:
        <label for="api-show-inherited">
            <input type="checkbox" id="api-show-inherited" checked="">
            Inherited
        </label>

        <label for="api-show-protected">
            <input type="checkbox" id="api-show-protected">
            Protected
        </label>

        <label for="api-show-private">
            <input type="checkbox" id="api-show-private">
            Private
        </label>
        <label for="api-show-deprecated">
            <input type="checkbox" id="api-show-deprecated">
            Deprecated
        </label>

    </div>
            <div class="apidocs">
                <div id="docs-main">
                    <div class="content">
                        <h1>Graphics Class</h1>
<div class="box meta">
    

    

    
        <div class="foundat">
            Defined in: <a href="../files/easeljs_display_Graphics.js.html#l41"><code>Graphics:41</code></a>
        </div>
    

    
        
            Module: <a href="../modules/EaselJS.html">EaselJS</a>
        
    

    
</div>



<div class="box intro">
    <p>The Graphics class exposes an easy to use API for generating vector drawing instructions and drawing them to a
specified context. Note that you can use Graphics without any dependency on the EaselJS framework by calling <a href="Graphics.html#method_draw" class="crosslink">draw</a>
directly, or it can be used with the <a href="Shape.html" class="crosslink">Shape</a> object to draw vector graphics within the
context of an EaselJS display list.</p>
<p>There are two approaches to working with Graphics object: calling methods on a Graphics instance (the "Graphics API"), or
instantiating Graphics command objects and adding them to the graphics queue via <a href="Graphics.html#method_append" class="crosslink">append</a>.
The former abstracts the latter, simplifying beginning and ending paths, fills, and strokes.</p>
<pre class="code prettyprint"><code> var g = new createjs.Graphics();
 g.setStrokeStyle(1);
 g.beginStroke("#000000");
 g.beginFill("red");
 g.drawCircle(0,0,30);</code></pre>
<p>All drawing methods in Graphics return the Graphics instance, so they can be chained together. For example,
the following line of code would generate the instructions to draw a rectangle with a red stroke and blue fill:</p>
<pre class="code prettyprint"><code> myGraphics.beginStroke("red").beginFill("blue").drawRect(20, 20, 100, 50);</code></pre>
<p>Each graphics API call generates a command object (see below). The last command to be created can be accessed via
<a href="Graphics.html#property_command" class="crosslink">command</a>:</p>
<pre class="code prettyprint"><code> var fillCommand = myGraphics.beginFill("red").command;
 // ... later, update the fill style/color:
 fillCommand.style = "blue";
 // or change it to a bitmap fill:
 fillCommand.bitmap(myImage);</code></pre>
<p>For more direct control of rendering, you can instantiate and append command objects to the graphics queue directly. In this case, you
need to manage path creation manually, and ensure that fill/stroke is applied to a defined path:</p>
<pre class="code prettyprint"><code> // start a new path. Graphics.beginCmd is a reusable BeginPath instance:
 myGraphics.append(createjs.Graphics.beginCmd);
 // we need to define the path before applying the fill:
 var circle = new createjs.Graphics.Circle(0,0,30);
 myGraphics.append(circle);
 // fill the path we just defined:
 var fill = new createjs.Graphics.Fill("red");
 myGraphics.append(fill);</code></pre>
<p>These approaches can be used together, for example to insert a custom command:</p>
<pre class="code prettyprint"><code> myGraphics.beginFill("red");
 var customCommand = new CustomSpiralCommand(etc);
 myGraphics.append(customCommand);
 myGraphics.beginFill("blue");
 myGraphics.drawCircle(0, 0, 30);</code></pre>
<p>See <a href="Graphics.html#method_append" class="crosslink">append</a> for more info on creating custom commands.</p>
<p><h4>Tiny API</h4>
The Graphics class also includes a "tiny API", which is one or two-letter methods that are shortcuts for all of the
Graphics methods. These methods are great for creating compact instructions, and is used by the Toolkit for CreateJS
to generate readable code. All tiny methods are marked as protected, so you can view them by enabling protected
descriptions in the docs.
<table>
    <tr><td><b>Tiny</b></td><td><b>Method</b></td><td><b>Tiny</b></td><td><b>Method</b></td></tr>
    <tr><td>mt</td><td><a href="Graphics.html#method_moveTo" class="crosslink">moveTo</a> </td>
    <td>lt</td> <td><a href="Graphics.html#method_lineTo" class="crosslink">lineTo</a></td></tr>
    <tr><td>a/at</td><td><a href="Graphics.html#method_arc" class="crosslink">arc</a> / <a href="Graphics.html#method_arcTo" class="crosslink">arcTo</a> </td>
    <td>bt</td><td><a href="Graphics.html#method_bezierCurveTo" class="crosslink">bezierCurveTo</a> </td></tr>
    <tr><td>qt</td><td><a href="Graphics.html#method_quadraticCurveTo" class="crosslink">quadraticCurveTo</a> (also curveTo)</td>
    <td>r</td><td><a href="Graphics.html#method_rect" class="crosslink">rect</a> </td></tr>
    <tr><td>cp</td><td><a href="Graphics.html#method_closePath" class="crosslink">closePath</a> </td>
    <td>c</td><td><a href="Graphics.html#method_clear" class="crosslink">clear</a> </td></tr>
    <tr><td>f</td><td><a href="Graphics.html#method_beginFill" class="crosslink">beginFill</a> </td>
    <td>lf</td><td><a href="Graphics.html#method_beginLinearGradientFill" class="crosslink">beginLinearGradientFill</a> </td></tr>
    <tr><td>rf</td><td><a href="Graphics.html#method_beginRadialGradientFill" class="crosslink">beginRadialGradientFill</a> </td>
    <td>bf</td><td><a href="Graphics.html#method_beginBitmapFill" class="crosslink">beginBitmapFill</a> </td></tr>
    <tr><td>ef</td><td><a href="Graphics.html#method_endFill" class="crosslink">endFill</a> </td>
    <td>ss / sd</td><td><a href="Graphics.html#method_setStrokeStyle" class="crosslink">setStrokeStyle</a> / <a href="Graphics.html#method_setStrokeDash" class="crosslink">setStrokeDash</a> </td></tr>
    <tr><td>s</td><td><a href="Graphics.html#method_beginStroke" class="crosslink">beginStroke</a> </td>
    <td>ls</td><td><a href="Graphics.html#method_beginLinearGradientStroke" class="crosslink">beginLinearGradientStroke</a> </td></tr>
    <tr><td>rs</td><td><a href="Graphics.html#method_beginRadialGradientStroke" class="crosslink">beginRadialGradientStroke</a> </td>
    <td>bs</td><td><a href="Graphics.html#method_beginBitmapStroke" class="crosslink">beginBitmapStroke</a> </td></tr>
    <tr><td>es</td><td><a href="Graphics.html#method_endStroke" class="crosslink">endStroke</a> </td>
    <td>dr</td><td><a href="Graphics.html#method_drawRect" class="crosslink">drawRect</a> </td></tr>
    <tr><td>rr</td><td><a href="Graphics.html#method_drawRoundRect" class="crosslink">drawRoundRect</a> </td>
    <td>rc</td><td><a href="Graphics.html#method_drawRoundRectComplex" class="crosslink">drawRoundRectComplex</a> </td></tr>
    <tr><td>dc</td><td><a href="Graphics.html#method_drawCircle" class="crosslink">drawCircle</a> </td>
    <td>de</td><td><a href="Graphics.html#method_drawEllipse" class="crosslink">drawEllipse</a> </td></tr>
    <tr><td>dp</td><td><a href="Graphics.html#method_drawPolyStar" class="crosslink">drawPolyStar</a> </td>
    <td>p</td><td><a href="Graphics.html#method_decodePath" class="crosslink">decodePath</a> </td></tr>
</table>

<p>Here is the above example, using the tiny API instead.</p>
<pre class="code prettyprint"><code> myGraphics.s("red").f("blue").r(20, 20, 100, 50);</code></pre>

</div>


    <div class="constructor">
        <h2>Constructor</h2>
        <div id="method_Graphics" class="method item">
    <h3 class="name"><code>Graphics</code></h3>

    
        <span class="paren">()</span>
    

    

    

    

    

    

    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l41"><code>Graphics:41</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        
    </div>

    

    

    
</div>

    </div>


<div id="classdocs" class="tabview">
    <ul class="api-class-tabs">
        <li class="api-class-tab index"><a href="#index">Index</a></li>

        
            <li class="api-class-tab methods"><a href="#methods">Methods</a></li>
        
        
            <li class="api-class-tab properties"><a href="#properties">Properties</a></li>
        
        
        
    </ul>

    <div>
        <div id="index" class="api-class-tabpanel index">
            <h2 class="off-left">Item Index</h2>

            
                <div class="index-section methods">
                    <h3>Methods</h3>

                    <ul class="index-list methods">
                        
                            <li class="index-item method protected">
                                <a href="#method__getInstructions">_getInstructions</a>

                                
                                
                            </li>
                        
                            <li class="index-item method protected">
                                <a href="#method__setFill">_setFill</a>

                                
                                
                            </li>
                        
                            <li class="index-item method protected">
                                <a href="#method__setStroke">_setStroke</a>

                                
                                
                            </li>
                        
                            <li class="index-item method protected">
                                <a href="#method__updateInstructions">_updateInstructions</a>

                                
                                
                            </li>
                        
                            <li class="index-item method protected">
                                <a href="#method_a">a</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_append">append</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_arc">arc</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_arcTo">arcTo</a>

                                
                                
                            </li>
                        
                            <li class="index-item method protected">
                                <a href="#method_at">at</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_beginBitmapFill">beginBitmapFill</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_beginBitmapStroke">beginBitmapStroke</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_beginFill">beginFill</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_beginLinearGradientFill">beginLinearGradientFill</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_beginLinearGradientStroke">beginLinearGradientStroke</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_beginRadialGradientFill">beginRadialGradientFill</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_beginRadialGradientStroke">beginRadialGradientStroke</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_beginStroke">beginStroke</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_bezierCurveTo">bezierCurveTo</a>

                                
                                
                            </li>
                        
                            <li class="index-item method protected">
                                <a href="#method_bf">bf</a>

                                
                                
                            </li>
                        
                            <li class="index-item method protected">
                                <a href="#method_bs">bs</a>

                                
                                
                            </li>
                        
                            <li class="index-item method protected">
                                <a href="#method_bt">bt</a>

                                
                                
                            </li>
                        
                            <li class="index-item method protected">
                                <a href="#method_c">c</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_clear">clear</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_clone">clone</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_closePath">closePath</a>

                                
                                
                            </li>
                        
                            <li class="index-item method protected">
                                <a href="#method_cp">cp</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_curveTo">curveTo</a>

                                
                                
                            </li>
                        
                            <li class="index-item method protected">
                                <a href="#method_dc">dc</a>

                                
                                
                            </li>
                        
                            <li class="index-item method protected">
                                <a href="#method_de">de</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_decodePath">decodePath</a>

                                
                                
                            </li>
                        
                            <li class="index-item method protected">
                                <a href="#method_dp">dp</a>

                                
                                
                            </li>
                        
                            <li class="index-item method protected">
                                <a href="#method_dr">dr</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_draw">draw</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_drawAsPath">drawAsPath</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_drawCircle">drawCircle</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_drawEllipse">drawEllipse</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_drawPolyStar">drawPolyStar</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_drawRect">drawRect</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_drawRoundRect">drawRoundRect</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_drawRoundRectComplex">drawRoundRectComplex</a>

                                
                                
                            </li>
                        
                            <li class="index-item method protected">
                                <a href="#method_ef">ef</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_endFill">endFill</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_endStroke">endStroke</a>

                                
                                
                            </li>
                        
                            <li class="index-item method protected">
                                <a href="#method_es">es</a>

                                
                                
                            </li>
                        
                            <li class="index-item method protected">
                                <a href="#method_f">f</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_getHSL">getHSL</a>

                                
                                    <span class="flag static">static</span>
                                
                                
                            </li>
                        
                            <li class="index-item method deprecated">
                                <a href="#method_getInstructions">getInstructions</a>

                                
                                
                                    <span class="flag deprecated">deprecated</span>
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_getRGB">getRGB</a>

                                
                                    <span class="flag static">static</span>
                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_isEmpty">isEmpty</a>

                                
                                
                            </li>
                        
                            <li class="index-item method protected">
                                <a href="#method_lf">lf</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_lineTo">lineTo</a>

                                
                                
                            </li>
                        
                            <li class="index-item method protected">
                                <a href="#method_ls">ls</a>

                                
                                
                            </li>
                        
                            <li class="index-item method protected">
                                <a href="#method_lt">lt</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_moveTo">moveTo</a>

                                
                                
                            </li>
                        
                            <li class="index-item method protected">
                                <a href="#method_mt">mt</a>

                                
                                
                            </li>
                        
                            <li class="index-item method protected">
                                <a href="#method_p">p</a>

                                
                                
                            </li>
                        
                            <li class="index-item method protected">
                                <a href="#method_qt">qt</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_quadraticCurveTo">quadraticCurveTo</a>

                                
                                
                            </li>
                        
                            <li class="index-item method protected">
                                <a href="#method_r">r</a>

                                
                                
                            </li>
                        
                            <li class="index-item method protected">
                                <a href="#method_rc">rc</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_rect">rect</a>

                                
                                
                            </li>
                        
                            <li class="index-item method protected">
                                <a href="#method_rf">rf</a>

                                
                                
                            </li>
                        
                            <li class="index-item method protected">
                                <a href="#method_rr">rr</a>

                                
                                
                            </li>
                        
                            <li class="index-item method protected">
                                <a href="#method_rs">rs</a>

                                
                                
                            </li>
                        
                            <li class="index-item method protected">
                                <a href="#method_s">s</a>

                                
                                
                            </li>
                        
                            <li class="index-item method protected">
                                <a href="#method_sd">sd</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_setStrokeDash">setStrokeDash</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_setStrokeStyle">setStrokeStyle</a>

                                
                                
                            </li>
                        
                            <li class="index-item method protected">
                                <a href="#method_ss">ss</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_store">store</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_toString">toString</a>

                                
                                
                            </li>
                        
                            <li class="index-item method">
                                <a href="#method_unstore">unstore</a>

                                
                                
                            </li>
                        
                    </ul>
                </div>
            

            
                <div class="index-section properties">
                    <h3>Properties</h3>

                    <ul class="index-list properties">
                        
                            <li class="index-item property protected">
                                <a href="#property__activeInstructions">_activeInstructions</a>

                                
                                
                            </li>
                        
                            <li class="index-item property protected">
                                <a href="#property__commitIndex">_commitIndex</a>

                                
                                
                            </li>
                        
                            <li class="index-item property protected">
                                <a href="#property__ctx">_ctx</a>

                                
                                    <span class="flag static">static</span>
                                
                                
                            </li>
                        
                            <li class="index-item property protected">
                                <a href="#property__dirty">_dirty</a>

                                
                                
                            </li>
                        
                            <li class="index-item property protected">
                                <a href="#property__fill">_fill</a>

                                
                                
                            </li>
                        
                            <li class="index-item property protected">
                                <a href="#property__instructions">_instructions</a>

                                
                                
                            </li>
                        
                            <li class="index-item property protected">
                                <a href="#property__oldStrokeDash">_oldStrokeDash</a>

                                
                                
                            </li>
                        
                            <li class="index-item property protected">
                                <a href="#property__oldStrokeStyle">_oldStrokeStyle</a>

                                
                                
                            </li>
                        
                            <li class="index-item property protected">
                                <a href="#property__storeIndex">_storeIndex</a>

                                
                                
                            </li>
                        
                            <li class="index-item property protected">
                                <a href="#property__stroke">_stroke</a>

                                
                                
                            </li>
                        
                            <li class="index-item property protected">
                                <a href="#property__strokeDash">_strokeDash</a>

                                
                                
                            </li>
                        
                            <li class="index-item property protected">
                                <a href="#property__strokeIgnoreScale">_strokeIgnoreScale</a>

                                
                                
                            </li>
                        
                            <li class="index-item property protected">
                                <a href="#property__strokeStyle">_strokeStyle</a>

                                
                                
                            </li>
                        
                            <li class="index-item property">
                                <a href="#property_BASE_64">BASE_64</a>

                                
                                    <span class="flag static">static</span>
                                
                                
                            </li>
                        
                            <li class="index-item property">
                                <a href="#property_beginCmd">beginCmd</a>

                                
                                    <span class="flag static">static</span>
                                
                                
                            </li>
                        
                            <li class="index-item property">
                                <a href="#property_command">command</a>

                                
                                
                            </li>
                        
                            <li class="index-item property">
                                <a href="#property_instructions">instructions</a>

                                
                                
                            </li>
                        
                            <li class="index-item property">
                                <a href="#property_STROKE_CAPS_MAP">STROKE_CAPS_MAP</a>

                                
                                    <span class="flag static">static</span>
                                
                                
                            </li>
                        
                            <li class="index-item property">
                                <a href="#property_STROKE_JOINTS_MAP">STROKE_JOINTS_MAP</a>

                                
                                    <span class="flag static">static</span>
                                
                                
                            </li>
                        
                    </ul>
                </div>
            

            

            
        </div>

        
            <div id="methods" class="api-class-tabpanel">
                <h2 class="off-left">Methods</h2>

                
                    <div id="method__getInstructions" class="method item protected">
    <h3 class="name"><code>_getInstructions</code></h3>

    
        <span class="paren">()</span>
    

    
        <span class="returns-inline">
            <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array" class="crosslink external" target="_blank">Array</a></span>
        </span>
    

    

    
        <span class="flag protected">protected</span>
    

    

    

    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l379"><code>_getInstructions:379</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Use the <a href="Graphics.html#property_instructions" class="crosslink">instructions</a> property instead.</p>

    </div>

    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array" class="crosslink external" target="_blank">Array</a></span>:
                    
                    <p>The instructions array, useful for chaining</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method__setFill" class="method item protected">
    <h3 class="name"><code>_setFill</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>fill</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    

    

    
        <span class="flag protected">protected</span>
    

    

    

    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1597"><code>_setFill:1597</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        
    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">fill</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object" class="crosslink external" target="_blank">Object</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    

    
</div>

                
                    <div id="method__setStroke" class="method item protected">
    <h3 class="name"><code>_setStroke</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>stroke</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    

    

    
        <span class="flag protected">protected</span>
    

    

    

    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1608"><code>_setStroke:1608</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        
    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">stroke</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object" class="crosslink external" target="_blank">Object</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    

    
</div>

                
                    <div id="method__updateInstructions" class="method item protected">
    <h3 class="name"><code>_updateInstructions</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>commit</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    

    

    
        <span class="flag protected">protected</span>
    

    

    

    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1556"><code>_updateInstructions:1556</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        
    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">commit</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object" class="crosslink external" target="_blank">Object</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    

    
</div>

                
                    <div id="method_a" class="method item protected">
    <h3 class="name"><code>a</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>x</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>radius</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>startAngle</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>endAngle</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>anticlockwise</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    
        <span class="flag protected">protected</span>
    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1234"><code>a:1234</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Shortcut to arc.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">x</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">radius</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">startAngle</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Measured in radians.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">endAngle</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Measured in radians.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">anticlockwise</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Boolean" class="crosslink external" target="_blank">Boolean</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_append" class="method item">
    <h3 class="name"><code>append</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>command</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>clean</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l977"><code>append:977</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Appends a graphics command object to the graphics queue. Command objects expose an "exec" method
that accepts two parameters: the Context2D to operate on, and an arbitrary data object passed into
<a href="Graphics.html#method_draw" class="crosslink">draw</a>. The latter will usually be the Shape instance that called draw.</p>
<p>This method is used internally by Graphics methods, such as drawCircle, but can also be used directly to insert
built-in or custom graphics commands. For example:</p>
<pre class="code prettyprint"><code>    // attach data to our shape, so we can access it during the draw:
    myShape.color = "red";

    // append a Circle command object:
    myShape.graphics.append(new createjs.Graphics.Circle(50, 50, 30));

    // append a custom command object with an exec method that sets the fill style
    // based on the shape&#39;s data, and then fills the circle.
    myShape.graphics.append({exec:function(ctx, shape) {
        ctx.fillStyle = shape.color;
        ctx.fill();
    }});</code></pre>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">command</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object" class="crosslink external" target="_blank">Object</a></span>
                    

                    

                    <div class="param-description">
                        <p>A graphics command object exposing an "exec" method.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">clean</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Boolean" class="crosslink external" target="_blank">Boolean</a></span>
                    

                    

                    <div class="param-description">
                        <p>The clean param is primarily for internal use. A value of true indicates that a command does not generate a path that should be stroked or filled.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_arc" class="method item">
    <h3 class="name"><code>arc</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>x</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>radius</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>startAngle</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>endAngle</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>anticlockwise</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l507"><code>arc:507</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Draws an arc defined by the radius, startAngle and endAngle arguments, centered at the position (x, y). For
example, to draw a full circle with a radius of 20 centered at (100, 100):</p>
<pre class="code prettyprint"><code> arc(100, 100, 20, 0, Math.PI*2);</code></pre>
<p>For detailed information, read the
<a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#dom-context-2d-arc">whatwg spec</a>.
A tiny API method "a" also exists.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">x</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">radius</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">startAngle</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Measured in radians.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">endAngle</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Measured in radians.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">anticlockwise</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Boolean" class="crosslink external" target="_blank">Boolean</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_arcTo" class="method item">
    <h3 class="name"><code>arcTo</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>x1</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y1</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>x2</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y2</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>radius</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l490"><code>arcTo:490</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Draws an arc with the specified control points and radius.  For detailed information, read the
<a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#dom-context-2d-arcto">
whatwg spec</a>. A tiny API method "at" also exists.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">x1</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y1</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">x2</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y2</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">radius</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_at" class="method item protected">
    <h3 class="name"><code>at</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>x1</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y1</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>x2</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y2</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>radius</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    
        <span class="flag protected">protected</span>
    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1193"><code>at:1193</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Shortcut to arcTo.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">x1</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y1</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">x2</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y2</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">radius</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_beginBitmapFill" class="method item">
    <h3 class="name"><code>beginBitmapFill</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>image</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>repetition</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>matrix</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l670"><code>beginBitmapFill:670</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Begins a pattern fill using the specified image. This ends the current sub-path. A tiny API method "bf" also
exists.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">image</code>
                        <span class="type">HTMLImageElement | HTMLCanvasElement | HTMLVideoElement</span>
                    

                    

                    <div class="param-description">
                        <p>The Image, Canvas, or Video object to use
as the pattern. Must be loaded prior to creating a bitmap fill, or the fill will be empty.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">repetition</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/String" class="crosslink external" target="_blank">String</a></span>
                    

                    

                    <div class="param-description">
                        <p>Optional. Indicates whether to repeat the image in the fill area. One of "repeat",
"repeat-x", "repeat-y", or "no-repeat". Defaults to "repeat". Note that Firefox does not support "repeat-x" or
"repeat-y" (latest tests were in FF 20.0), and will default to "repeat".</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">matrix</code>
                        <span class="type"><a href="Matrix2D.html" class="crosslink">Matrix2D</a></span>
                    

                    

                    <div class="param-description">
                        <p>Optional. Specifies a transformation matrix for the bitmap fill. This transformation
will be applied relative to the parent transform.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_beginBitmapStroke" class="method item">
    <h3 class="name"><code>beginBitmapStroke</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>image</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code class="optional">[repetition=repeat]</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l816"><code>beginBitmapStroke:816</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Begins a pattern fill using the specified image. This ends the current sub-path. Note that unlike bitmap fills,
strokes do not currently support a matrix parameter due to limitations in the canvas API. A tiny API method "bs"
also exists.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">image</code>
                        <span class="type">HTMLImageElement | HTMLCanvasElement | HTMLVideoElement</span>
                    

                    

                    <div class="param-description">
                        <p>The Image, Canvas, or Video object to use
as the pattern. Must be loaded prior to creating a bitmap fill, or the fill will be empty.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name optional">[repetition=repeat]</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/String" class="crosslink external" target="_blank">String</a></span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>
                    

                    

                    <div class="param-description">
                        <p>Optional. Indicates whether to repeat the image in the fill area. One of
"repeat", "repeat-x", "repeat-y", or "no-repeat". Defaults to "repeat".</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_beginFill" class="method item">
    <h3 class="name"><code>beginFill</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>color</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l609"><code>beginFill:609</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Begins a fill with the specified color. This ends the current sub-path. A tiny API method "f" also exists.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">color</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/String" class="crosslink external" target="_blank">String</a></span>
                    

                    

                    <div class="param-description">
                        <p>A CSS compatible color value (ex. "red", "#FF0000", or "rgba(255,0,0,0.5)"). Setting to
null will result in no fill.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_beginLinearGradientFill" class="method item">
    <h3 class="name"><code>beginLinearGradientFill</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>colors</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>ratios</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>x0</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y0</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>x1</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y1</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l621"><code>beginLinearGradientFill:621</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Begins a linear gradient fill defined by the line (x0, y0) to (x1, y1). This ends the current sub-path. For
example, the following code defines a black to white vertical gradient ranging from 20px to 120px, and draws a
square to display it:</p>
<pre class="code prettyprint"><code> myGraphics.beginLinearGradientFill(["#000","#FFF"], [0, 1], 0, 20, 0, 120).drawRect(20, 20, 120, 120);</code></pre>
<p>A tiny API method "lf" also exists.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">colors</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array" class="crosslink external" target="_blank">Array</a></span>
                    

                    

                    <div class="param-description">
                        <p>An array of CSS compatible color values. For example, ["#F00","#00F"] would define a gradient
drawing from red to blue.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">ratios</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array" class="crosslink external" target="_blank">Array</a></span>
                    

                    

                    <div class="param-description">
                        <p>An array of gradient positions which correspond to the colors. For example, [0.1, 0.9] would draw
the first color to 10% then interpolating to the second color at 90%.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">x0</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The position of the first point defining the line that defines the gradient direction and size.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y0</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The position of the first point defining the line that defines the gradient direction and size.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">x1</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The position of the second point defining the line that defines the gradient direction and size.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y1</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The position of the second point defining the line that defines the gradient direction and size.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_beginLinearGradientStroke" class="method item">
    <h3 class="name"><code>beginLinearGradientStroke</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>colors</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>ratios</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>x0</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y0</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>x1</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y1</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l763"><code>beginLinearGradientStroke:763</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Begins a linear gradient stroke defined by the line (x0, y0) to (x1, y1). This ends the current sub-path. For
example, the following code defines a black to white vertical gradient ranging from 20px to 120px, and draws a
square to display it:</p>
<pre class="code prettyprint"><code> myGraphics.setStrokeStyle(10).
     beginLinearGradientStroke(["#000","#FFF"], [0, 1], 0, 20, 0, 120).drawRect(20, 20, 120, 120);</code></pre>
<p>A tiny API method "ls" also exists.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">colors</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array" class="crosslink external" target="_blank">Array</a></span>
                    

                    

                    <div class="param-description">
                        <p>An array of CSS compatible color values. For example, ["#F00","#00F"] would define
a gradient drawing from red to blue.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">ratios</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array" class="crosslink external" target="_blank">Array</a></span>
                    

                    

                    <div class="param-description">
                        <p>An array of gradient positions which correspond to the colors. For example, [0.1,
0.9] would draw the first color to 10% then interpolating to the second color at 90%.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">x0</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The position of the first point defining the line that defines the gradient direction and size.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y0</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The position of the first point defining the line that defines the gradient direction and size.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">x1</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The position of the second point defining the line that defines the gradient direction and size.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y1</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The position of the second point defining the line that defines the gradient direction and size.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_beginRadialGradientFill" class="method item">
    <h3 class="name"><code>beginRadialGradientFill</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>colors</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>ratios</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>x0</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y0</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>r0</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>x1</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y1</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>r1</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l645"><code>beginRadialGradientFill:645</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Begins a radial gradient fill. This ends the current sub-path. For example, the following code defines a red to
blue radial gradient centered at (100, 100), with a radius of 50, and draws a circle to display it:</p>
<pre class="code prettyprint"><code> myGraphics.beginRadialGradientFill(["#F00","#00F"], [0, 1], 100, 100, 0, 100, 100, 50).drawCircle(100, 100, 50);</code></pre>
<p>A tiny API method "rf" also exists.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">colors</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array" class="crosslink external" target="_blank">Array</a></span>
                    

                    

                    <div class="param-description">
                        <p>An array of CSS compatible color values. For example, ["#F00","#00F"] would define
a gradient drawing from red to blue.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">ratios</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array" class="crosslink external" target="_blank">Array</a></span>
                    

                    

                    <div class="param-description">
                        <p>An array of gradient positions which correspond to the colors. For example, [0.1,
0.9] would draw the first color to 10% then interpolating to the second color at 90%.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">x0</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Center position of the inner circle that defines the gradient.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y0</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Center position of the inner circle that defines the gradient.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">r0</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Radius of the inner circle that defines the gradient.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">x1</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Center position of the outer circle that defines the gradient.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y1</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Center position of the outer circle that defines the gradient.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">r1</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Radius of the outer circle that defines the gradient.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_beginRadialGradientStroke" class="method item">
    <h3 class="name"><code>beginRadialGradientStroke</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>colors</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>ratios</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>x0</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y0</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>r0</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>x1</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y1</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>r1</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l788"><code>beginRadialGradientStroke:788</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Begins a radial gradient stroke. This ends the current sub-path. For example, the following code defines a red to
blue radial gradient centered at (100, 100), with a radius of 50, and draws a rectangle to display it:</p>
<pre class="code prettyprint"><code> myGraphics.setStrokeStyle(10)
     .beginRadialGradientStroke(["#F00","#00F"], [0, 1], 100, 100, 0, 100, 100, 50)
     .drawRect(50, 90, 150, 110);</code></pre>
<p>A tiny API method "rs" also exists.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">colors</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array" class="crosslink external" target="_blank">Array</a></span>
                    

                    

                    <div class="param-description">
                        <p>An array of CSS compatible color values. For example, ["#F00","#00F"] would define
a gradient drawing from red to blue.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">ratios</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array" class="crosslink external" target="_blank">Array</a></span>
                    

                    

                    <div class="param-description">
                        <p>An array of gradient positions which correspond to the colors. For example, [0.1,
0.9] would draw the first color to 10% then interpolating to the second color at 90%, then draw the second color
to 100%.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">x0</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Center position of the inner circle that defines the gradient.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y0</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Center position of the inner circle that defines the gradient.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">r0</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Radius of the inner circle that defines the gradient.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">x1</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Center position of the outer circle that defines the gradient.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y1</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Center position of the outer circle that defines the gradient.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">r1</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Radius of the outer circle that defines the gradient.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_beginStroke" class="method item">
    <h3 class="name"><code>beginStroke</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>color</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l751"><code>beginStroke:751</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Begins a stroke with the specified color. This ends the current sub-path. A tiny API method "s" also exists.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">color</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/String" class="crosslink external" target="_blank">String</a></span>
                    

                    

                    <div class="param-description">
                        <p>A CSS compatible color value (ex. "#FF0000", "red", or "rgba(255,0,0,0.5)"). Setting to
null will result in no stroke.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_bezierCurveTo" class="method item">
    <h3 class="name"><code>bezierCurveTo</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>cp1x</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>cp1y</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>cp2x</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>cp2y</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>x</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l546"><code>bezierCurveTo:546</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Draws a bezier curve from the current drawing point to (x, y) using the control points (cp1x, cp1y) and (cp2x,
cp2y). For detailed information, read the
<a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#dom-context-2d-beziercurveto">
whatwg spec</a>. A tiny API method "bt" also exists.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">cp1x</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">cp1y</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">cp2x</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">cp2y</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">x</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_bf" class="method item protected">
    <h3 class="name"><code>bf</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>image</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>repetition</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>matrix</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    
        <span class="flag protected">protected</span>
    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1327"><code>bf:1327</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Shortcut to beginBitmapFill.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">image</code>
                        <span class="type">HTMLImageElement | HTMLCanvasElement | HTMLVideoElement</span>
                    

                    

                    <div class="param-description">
                        <p>The Image, Canvas, or Video object to use
as the pattern.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">repetition</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/String" class="crosslink external" target="_blank">String</a></span>
                    

                    

                    <div class="param-description">
                        <p>Optional. Indicates whether to repeat the image in the fill area. One of "repeat",
"repeat-x", "repeat-y", or "no-repeat". Defaults to "repeat". Note that Firefox does not support "repeat-x" or
"repeat-y" (latest tests were in FF 20.0), and will default to "repeat".</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">matrix</code>
                        <span class="type"><a href="Matrix2D.html" class="crosslink">Matrix2D</a></span>
                    

                    

                    <div class="param-description">
                        <p>Optional. Specifies a transformation matrix for the bitmap fill. This transformation
will be applied relative to the parent transform.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_bs" class="method item protected">
    <h3 class="name"><code>bs</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>image</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code class="optional">[repetition=repeat]</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    
        <span class="flag protected">protected</span>
    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1433"><code>bs:1433</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Shortcut to beginBitmapStroke.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">image</code>
                        <span class="type">HTMLImageElement | HTMLCanvasElement | HTMLVideoElement</span>
                    

                    

                    <div class="param-description">
                        <p>The Image, Canvas, or Video object to use
as the pattern.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name optional">[repetition=repeat]</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/String" class="crosslink external" target="_blank">String</a></span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>
                    

                    

                    <div class="param-description">
                        <p>Optional. Indicates whether to repeat the image in the fill area. One of
"repeat", "repeat-x", "repeat-y", or "no-repeat". Defaults to "repeat".</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_bt" class="method item protected">
    <h3 class="name"><code>bt</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>cp1x</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>cp1y</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>cp2x</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>cp2y</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>x</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    
        <span class="flag protected">protected</span>
    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1207"><code>bt:1207</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Shortcut to bezierCurveTo.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">cp1x</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">cp1y</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">cp2x</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">cp2y</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">x</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_c" class="method item protected">
    <h3 class="name"><code>c</code></h3>

    
        <span class="paren">()</span>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    
        <span class="flag protected">protected</span>
    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1271"><code>c:1271</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Shortcut to clear.</p>

    </div>

    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_clear" class="method item">
    <h3 class="name"><code>clear</code></h3>

    
        <span class="paren">()</span>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l595"><code>clear:595</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Clears all drawing instructions, effectively resetting this Graphics instance. Any line and fill styles will need
to be redefined to draw shapes following a clear call. A tiny API method "c" also exists.</p>

    </div>

    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_clone" class="method item">
    <h3 class="name"><code>clone</code></h3>

    
        <span class="paren">()</span>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1139"><code>clone:1139</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Returns a clone of this Graphics instance. Note that the individual command objects are not cloned.</p>

    </div>

    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>A clone of the current Graphics instance.</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_closePath" class="method item">
    <h3 class="name"><code>closePath</code></h3>

    
        <span class="paren">()</span>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l582"><code>closePath:582</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Closes the current path, effectively drawing a line from the current drawing point to the first drawing point specified
since the fill or stroke was last set. A tiny API method "cp" also exists.</p>

    </div>

    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_cp" class="method item protected">
    <h3 class="name"><code>cp</code></h3>

    
        <span class="paren">()</span>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    
        <span class="flag protected">protected</span>
    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1262"><code>cp:1262</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Shortcut to closePath.</p>

    </div>

    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_curveTo" class="method item">
    <h3 class="name"><code>curveTo</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>cpx</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>cpy</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>x</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l844"><code>curveTo:844</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Maps the familiar ActionScript <code>curveTo()</code> method to the functionally similar <a href="Graphics.html#method_quadraticCurveTo" class="crosslink">quadraticCurveTo</a>
method.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">cpx</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">cpy</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">x</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_dc" class="method item protected">
    <h3 class="name"><code>dc</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>x</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>radius</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    
        <span class="flag protected">protected</span>
    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1499"><code>dc:1499</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Shortcut to drawCircle.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">x</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>x coordinate center point of circle.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>y coordinate center point of circle.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">radius</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Radius of circle.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_de" class="method item protected">
    <h3 class="name"><code>de</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>x</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>w</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>h</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    
        <span class="flag protected">protected</span>
    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1511"><code>de:1511</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Shortcut to drawEllipse.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">x</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The left coordinate point of the ellipse. Note that this is different from <a href="Graphics.html#method_drawCircle" class="crosslink">drawCircle</a>
which draws from center.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The top coordinate point of the ellipse. Note that this is different from <a href="Graphics.html#method_drawCircle" class="crosslink">drawCircle</a>
which draws from the center.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">w</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The height (horizontal diameter) of the ellipse. The horizontal radius will be half of this
number.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">h</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The width (vertical diameter) of the ellipse. The vertical radius will be half of this number.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_decodePath" class="method item">
    <h3 class="name"><code>decodePath</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>str</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1011"><code>decodePath:1011</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Decodes a compact encoded path string into a series of draw instructions.
This format is not intended to be human readable, and is meant for use by authoring tools.
The format uses a base64 character set, with each character representing 6 bits, to define a series of draw
commands.</p>
<p>Each command is comprised of a single "header" character followed by a variable number of alternating x and y
position values. Reading the header bits from left to right (most to least significant): bits 1 to 3 specify the
type of operation (0-moveTo, 1-lineTo, 2-quadraticCurveTo, 3-bezierCurveTo, 4-closePath, 5-7 unused). Bit 4
indicates whether position values use 12 bits (2 characters) or 18 bits (3 characters), with a one indicating the
latter. Bits 5 and 6 are currently unused.</p>
<p>Following the header is a series of 0 (closePath), 2 (moveTo, lineTo), 4 (quadraticCurveTo), or 6 (bezierCurveTo)
parameters. These parameters are alternating x/y positions represented by 2 or 3 characters (as indicated by the
4th bit in the command char). These characters consist of a 1 bit sign (1 is negative, 0 is positive), followed
by an 11 (2 char) or 17 (3 char) bit integer value. All position values are in tenths of a pixel. Except in the
case of move operations which are absolute, this value is a delta from the previous x or y position (as
appropriate).</p>
<p>For example, the string "A3cAAMAu4AAA" represents a line starting at -150,0 and ending at 150,0.
<br>A - bits 000000. First 3 bits (000) indicate a moveTo operation. 4th bit (0) indicates 2 chars per
parameter.
<br>n0 - 110111011100. Absolute x position of -150.0px. First bit indicates a negative value, remaining bits
indicate 1500 tenths of a pixel.
<br>AA - 000000000000. Absolute y position of 0.
<br>I - 001100. First 3 bits (001) indicate a lineTo operation. 4th bit (1) indicates 3 chars per parameter.
<br>Au4 - 000000101110111000. An x delta of 300.0px, which is added to the previous x value of -150.0px to
provide an absolute position of +150.0px.
<br>AAA - 000000000000000000. A y delta value of 0.</p>
<p>A tiny API method "p" also exists.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">str</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/String" class="crosslink external" target="_blank">String</a></span>
                    

                    

                    <div class="param-description">
                        <p>The path string to decode.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_dp" class="method item protected">
    <h3 class="name"><code>dp</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>x</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>radius</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>sides</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>pointSize</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>angle</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    
        <span class="flag protected">protected</span>
    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1527"><code>dp:1527</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Shortcut to drawPolyStar.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">x</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Position of the center of the shape.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Position of the center of the shape.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">radius</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The outer radius of the shape.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">sides</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The number of points on the star or sides on the polygon.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">pointSize</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The depth or "pointy-ness" of the star points. A pointSize of 0 will draw a regular
polygon (no points), a pointSize of 1 will draw nothing because the points are infinitely pointy.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">angle</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The angle of the first point / corner. For example a value of 0 will draw the first point
directly to the right of the center.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_dr" class="method item protected">
    <h3 class="name"><code>dr</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>x</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>w</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>h</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    
        <span class="flag protected">protected</span>
    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1455"><code>dr:1455</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Shortcut to drawRect.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">x</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">w</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Width of the rectangle</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">h</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Height of the rectangle</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_draw" class="method item">
    <h3 class="name"><code>draw</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>ctx</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>data</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    

    

    

    

    

    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l424"><code>draw:424</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Draws the display object into the specified context ignoring its visible, alpha, shadow, and transform.
Returns true if the draw was handled (useful for overriding functionality).</p>
<p>NOTE: This method is mainly for internal use, though it may be useful for advanced uses.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">ctx</code>
                        <span class="type">CanvasRenderingContext2D</span>
                    

                    

                    <div class="param-description">
                        <p>The canvas 2D context object to draw into.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">data</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object" class="crosslink external" target="_blank">Object</a></span>
                    

                    

                    <div class="param-description">
                        <p>Optional data that is passed to graphics command exec methods. When called from a Shape instance, the shape passes itself as the data parameter. This can be used by custom graphic commands to insert contextual data.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    

    
</div>

                
                    <div id="method_drawAsPath" class="method item">
    <h3 class="name"><code>drawAsPath</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>ctx</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    

    

    

    

    

    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l441"><code>drawAsPath:441</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Draws only the path described for this Graphics instance, skipping any non-path instructions, including fill and
stroke descriptions. Used for <code>DisplayObject.mask</code> to draw the clipping path, for example.</p>
<p>NOTE: This method is mainly for internal use, though it may be useful for advanced uses.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">ctx</code>
                        <span class="type">CanvasRenderingContext2D</span>
                    

                    

                    <div class="param-description">
                        <p>The canvas 2D context object to draw into.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    

    
</div>

                
                    <div id="method_drawCircle" class="method item">
    <h3 class="name"><code>drawCircle</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>x</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>radius</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l905"><code>drawCircle:905</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Draws a circle with the specified radius at (x, y).</p>
<pre class="code prettyprint"><code> var g = new createjs.Graphics();
    g.setStrokeStyle(1);
    g.beginStroke(createjs.Graphics.getRGB(0,0,0));
    g.beginFill(createjs.Graphics.getRGB(255,0,0));
    g.drawCircle(0,0,3);

    var s = new createjs.Shape(g);
    s.x = 100;
    s.y = 100;

    stage.addChild(s);
    stage.update();</code></pre>
<p>A tiny API method "dc" also exists.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">x</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>x coordinate center point of circle.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>y coordinate center point of circle.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">radius</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Radius of circle.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_drawEllipse" class="method item">
    <h3 class="name"><code>drawEllipse</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>x</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>w</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>h</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l933"><code>drawEllipse:933</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Draws an ellipse (oval) with a specified width (w) and height (h). Similar to <a href="Graphics.html#method_drawCircle" class="crosslink">drawCircle</a>,
except the width and height can be different. A tiny API method "de" also exists.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">x</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The left coordinate point of the ellipse. Note that this is different from <a href="Graphics.html#method_drawCircle" class="crosslink">drawCircle</a>
which draws from center.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The top coordinate point of the ellipse. Note that this is different from <a href="Graphics.html#method_drawCircle" class="crosslink">drawCircle</a>
which draws from the center.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">w</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The height (horizontal diameter) of the ellipse. The horizontal radius will be half of this
number.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">h</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The width (vertical diameter) of the ellipse. The vertical radius will be half of this number.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_drawPolyStar" class="method item">
    <h3 class="name"><code>drawPolyStar</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>x</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>radius</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>sides</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>pointSize</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>angle</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l951"><code>drawPolyStar:951</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Draws a star if pointSize is greater than 0, or a regular polygon if pointSize is 0 with the specified number of
points. For example, the following code will draw a familiar 5 pointed star shape centered at 100, 100 and with a
radius of 50:</p>
<pre class="code prettyprint"><code> myGraphics.beginFill("#FF0").drawPolyStar(100, 100, 50, 5, 0.6, -90);
 // Note: -90 makes the first point vertical</code></pre>
<p>A tiny API method "dp" also exists.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">x</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Position of the center of the shape.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Position of the center of the shape.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">radius</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The outer radius of the shape.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">sides</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The number of points on the star or sides on the polygon.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">pointSize</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The depth or "pointy-ness" of the star points. A pointSize of 0 will draw a regular
polygon (no points), a pointSize of 1 will draw nothing because the points are infinitely pointy.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">angle</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The angle of the first point / corner. For example a value of 0 will draw the first point
directly to the right of the center.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_drawRect" class="method item">
    <h3 class="name"><code>drawRect</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>x</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>w</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>h</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l857"><code>drawRect:857</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Maps the familiar ActionScript <code>drawRect()</code> method to the functionally similar <a href="Graphics.html#method_rect" class="crosslink">rect</a>
 method.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">x</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">w</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Width of the rectangle</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">h</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Height of the rectangle</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_drawRoundRect" class="method item">
    <h3 class="name"><code>drawRoundRect</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>x</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>w</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>h</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>radius</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l871"><code>drawRoundRect:871</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Draws a rounded rectangle with all corners with the specified radius.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">x</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">w</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">h</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">radius</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Corner radius.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_drawRoundRectComplex" class="method item">
    <h3 class="name"><code>drawRoundRectComplex</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>x</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>w</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>h</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>radiusTL</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>radiusTR</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>radiusBR</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>radiusBL</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l886"><code>drawRoundRectComplex:886</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Draws a rounded rectangle with different corner radii. Supports positive and negative corner radii. A tiny API
method "rc" also exists.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">x</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The horizontal coordinate to draw the round rect.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The vertical coordinate to draw the round rect.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">w</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The width of the round rect.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">h</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The height of the round rect.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">radiusTL</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Top left corner radius.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">radiusTR</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Top right corner radius.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">radiusBR</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Bottom right corner radius.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">radiusBL</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Bottom left corner radius.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_ef" class="method item protected">
    <h3 class="name"><code>ef</code></h3>

    
        <span class="paren">()</span>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    
        <span class="flag protected">protected</span>
    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1343"><code>ef:1343</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Shortcut to endFill.</p>

    </div>

    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_endFill" class="method item">
    <h3 class="name"><code>endFill</code></h3>

    
        <span class="paren">()</span>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l688"><code>endFill:688</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Ends the current sub-path, and begins a new one with no fill. Functionally identical to <code>beginFill(null)</code>.
A tiny API method "ef" also exists.</p>

    </div>

    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_endStroke" class="method item">
    <h3 class="name"><code>endStroke</code></h3>

    
        <span class="paren">()</span>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l833"><code>endStroke:833</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Ends the current sub-path, and begins a new one with no stroke. Functionally identical to <code>beginStroke(null)</code>.
A tiny API method "es" also exists.</p>

    </div>

    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_es" class="method item protected">
    <h3 class="name"><code>es</code></h3>

    
        <span class="paren">()</span>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    
        <span class="flag protected">protected</span>
    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1446"><code>es:1446</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Shortcut to endStroke.</p>

    </div>

    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_f" class="method item protected">
    <h3 class="name"><code>f</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>color</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    
        <span class="flag protected">protected</span>
    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1280"><code>f:1280</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Shortcut to beginFill.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">color</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/String" class="crosslink external" target="_blank">String</a></span>
                    

                    

                    <div class="param-description">
                        <p>A CSS compatible color value (ex. "red", "#FF0000", or "rgba(255,0,0,0.5)"). Setting to
null will result in no fill.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_getHSL" class="method item">
    <h3 class="name"><code>getHSL</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>hue</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>saturation</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>lightness</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code class="optional">[alpha]</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/String" class="crosslink external" target="_blank">String</a></span>
        </span>
    

    

    

    

    
        <span class="flag static">static</span>
    

    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l288"><code>getHSL:288</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Returns a CSS compatible color string based on the specified HSL numeric color values in the format "hsla(360,100,100,1.0)",
or if alpha is null then in the format "hsl(360,100,100)".</p>
<pre class="code prettyprint"><code> createjs.Graphics.getHSL(150, 100, 70);
 // Returns "hsl(150,100,70)"</code></pre>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">hue</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The hue component for the color, between 0 and 360.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">saturation</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The saturation component for the color, between 0 and 100.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">lightness</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The lightness component for the color, between 0 and 100.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name optional">[alpha]</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>
                    

                    

                    <div class="param-description">
                        <p>The alpha component for the color where 0 is fully transparent and 1 is fully opaque.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/String" class="crosslink external" target="_blank">String</a></span>:
                    
                    <p>A CSS compatible color string based on the specified HSL numeric color values in the format
"hsla(360,100,100,1.0)", or if alpha is null then in the format "hsl(360,100,100)".</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_getInstructions" class="method item deprecated">
    <h3 class="name"><code>getInstructions</code></h3>

    
        <span class="paren">()</span>
    

    

    
        <span class="flag deprecated">deprecated</span>
    

    

    

    

    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l390"><code>getInstructions:390</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Use the <a href="Graphics.html#property_instructions" class="crosslink">instructions</a> property instead.</p>

    </div>

    

    

    
</div>

                
                    <div id="method_getRGB" class="method item">
    <h3 class="name"><code>getRGB</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>r</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>g</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>b</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code class="optional">[alpha]</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/String" class="crosslink external" target="_blank">String</a></span>
        </span>
    

    

    

    

    
        <span class="flag static">static</span>
    

    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l252"><code>getRGB:252</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Returns a CSS compatible color string based on the specified RGB numeric color values in the format
"rgba(255,255,255,1.0)", or if alpha is null then in the format "rgb(255,255,255)". For example,</p>
<pre class="code prettyprint"><code> createjs.Graphics.getRGB(50, 100, 150, 0.5);
 // Returns "rgba(50,100,150,0.5)"</code></pre>
<p>It also supports passing a single hex color value as the first param, and an optional alpha value as the second
param. For example,</p>
<pre class="code prettyprint"><code> createjs.Graphics.getRGB(0xFF00FF, 0.2);
 // Returns "rgba(255,0,255,0.2)"</code></pre>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">r</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The red component for the color, between 0 and 0xFF (255).</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">g</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The green component for the color, between 0 and 0xFF (255).</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">b</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The blue component for the color, between 0 and 0xFF (255).</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name optional">[alpha]</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>
                    

                    

                    <div class="param-description">
                        <p>The alpha component for the color where 0 is fully transparent and 1 is fully opaque.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/String" class="crosslink external" target="_blank">String</a></span>:
                    
                    <p>A CSS compatible color string based on the specified RGB numeric color values in the format
"rgba(255,255,255,1.0)", or if alpha is null then in the format "rgb(255,255,255)".</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_isEmpty" class="method item">
    <h3 class="name"><code>isEmpty</code></h3>

    
        <span class="paren">()</span>
    

    
        <span class="returns-inline">
            <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Boolean" class="crosslink external" target="_blank">Boolean</a></span>
        </span>
    

    

    

    

    

    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l415"><code>isEmpty:415</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Returns true if this Graphics instance has no drawing commands.</p>

    </div>

    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Boolean" class="crosslink external" target="_blank">Boolean</a></span>:
                    
                    <p>Returns true if this Graphics instance has no drawing commands.</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_lf" class="method item protected">
    <h3 class="name"><code>lf</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>colors</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>ratios</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>x0</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y0</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>x1</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y1</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    
        <span class="flag protected">protected</span>
    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1291"><code>lf:1291</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Shortcut to beginLinearGradientFill.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">colors</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array" class="crosslink external" target="_blank">Array</a></span>
                    

                    

                    <div class="param-description">
                        <p>An array of CSS compatible color values. For example, ["#F00","#00F"] would define a gradient
drawing from red to blue.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">ratios</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array" class="crosslink external" target="_blank">Array</a></span>
                    

                    

                    <div class="param-description">
                        <p>An array of gradient positions which correspond to the colors. For example, [0.1, 0.9] would draw
the first color to 10% then interpolating to the second color at 90%.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">x0</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The position of the first point defining the line that defines the gradient direction and size.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y0</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The position of the first point defining the line that defines the gradient direction and size.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">x1</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The position of the second point defining the line that defines the gradient direction and size.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y1</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The position of the second point defining the line that defines the gradient direction and size.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_lineTo" class="method item">
    <h3 class="name"><code>lineTo</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>x</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l472"><code>lineTo:472</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Draws a line from the current drawing point to the specified position, which become the new current drawing
point. Note that you <em>must</em> call <a href="Graphics.html#method_moveTo" class="crosslink">moveTo</a> before the first <code>lineTo()</code>.
A tiny API method "lt" also exists.</p>
<p>For detailed information, read the
<a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#complex-shapes-(paths)">
whatwg spec</a>.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">x</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The x coordinate the drawing point should draw to.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The y coordinate the drawing point should draw to.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_ls" class="method item protected">
    <h3 class="name"><code>ls</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>colors</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>ratios</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>x0</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y0</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>x1</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y1</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    
        <span class="flag protected">protected</span>
    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1396"><code>ls:1396</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Shortcut to beginLinearGradientStroke.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">colors</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array" class="crosslink external" target="_blank">Array</a></span>
                    

                    

                    <div class="param-description">
                        <p>An array of CSS compatible color values. For example, ["#F00","#00F"] would define
a gradient drawing from red to blue.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">ratios</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array" class="crosslink external" target="_blank">Array</a></span>
                    

                    

                    <div class="param-description">
                        <p>An array of gradient positions which correspond to the colors. For example, [0.1,
0.9] would draw the first color to 10% then interpolating to the second color at 90%.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">x0</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The position of the first point defining the line that defines the gradient direction and size.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y0</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The position of the first point defining the line that defines the gradient direction and size.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">x1</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The position of the second point defining the line that defines the gradient direction and size.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y1</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The position of the second point defining the line that defines the gradient direction and size.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_lt" class="method item protected">
    <h3 class="name"><code>lt</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>x</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    
        <span class="flag protected">protected</span>
    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1182"><code>lt:1182</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Shortcut to lineTo.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">x</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The x coordinate the drawing point should draw to.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The y coordinate the drawing point should draw to.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_moveTo" class="method item">
    <h3 class="name"><code>moveTo</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>x</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l460"><code>moveTo:460</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Moves the drawing point to the specified position. A tiny API method "mt" also exists.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">x</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The x coordinate the drawing point should move to.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The y coordinate the drawing point should move to.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls).</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_mt" class="method item protected">
    <h3 class="name"><code>mt</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>x</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    
        <span class="flag protected">protected</span>
    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1171"><code>mt:1171</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Shortcut to moveTo.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">x</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The x coordinate the drawing point should move to.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The y coordinate the drawing point should move to.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls).</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_p" class="method item protected">
    <h3 class="name"><code>p</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>str</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    
        <span class="flag protected">protected</span>
    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1544"><code>p:1544</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Shortcut to decodePath.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">str</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/String" class="crosslink external" target="_blank">String</a></span>
                    

                    

                    <div class="param-description">
                        <p>The path string to decode.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_qt" class="method item protected">
    <h3 class="name"><code>qt</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>cpx</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>cpy</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>x</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    

    

    
        <span class="flag protected">protected</span>
    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1222"><code>qt:1222</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Shortcut to quadraticCurveTo / curveTo.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">cpx</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">cpy</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">x</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    

    
</div>

                
                    <div id="method_quadraticCurveTo" class="method item">
    <h3 class="name"><code>quadraticCurveTo</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>cpx</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>cpy</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>x</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l530"><code>quadraticCurveTo:530</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Draws a quadratic curve from the current drawing point to (x, y) using the control point (cpx, cpy). For detailed
information, read the <a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#dom-context-2d-quadraticcurveto">
whatwg spec</a>. A tiny API method "qt" also exists.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">cpx</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">cpy</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">x</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_r" class="method item protected">
    <h3 class="name"><code>r</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>x</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>w</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>h</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    
        <span class="flag protected">protected</span>
    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1249"><code>r:1249</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Shortcut to rect.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">x</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">w</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Width of the rectangle</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">h</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Height of the rectangle</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_rc" class="method item protected">
    <h3 class="name"><code>rc</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>x</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>w</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>h</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>radiusTL</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>radiusTR</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>radiusBR</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>radiusBL</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    
        <span class="flag protected">protected</span>
    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1482"><code>rc:1482</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Shortcut to drawRoundRectComplex.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">x</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The horizontal coordinate to draw the round rect.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The vertical coordinate to draw the round rect.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">w</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The width of the round rect.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">h</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The height of the round rect.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">radiusTL</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Top left corner radius.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">radiusTR</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Top right corner radius.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">radiusBR</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Bottom right corner radius.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">radiusBL</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Bottom left corner radius.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_rect" class="method item">
    <h3 class="name"><code>rect</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>x</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>w</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>h</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l565"><code>rect:565</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Draws a rectangle at (x, y) with the specified width and height using the current fill and/or stroke.
For detailed information, read the
<a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#dom-context-2d-rect">
whatwg spec</a>. A tiny API method "r" also exists.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">x</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">w</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Width of the rectangle</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">h</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Height of the rectangle</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_rf" class="method item protected">
    <h3 class="name"><code>rf</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>colors</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>ratios</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>x0</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y0</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>r0</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>x1</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y1</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>r1</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    
        <span class="flag protected">protected</span>
    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1308"><code>rf:1308</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Shortcut to beginRadialGradientFill.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">colors</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array" class="crosslink external" target="_blank">Array</a></span>
                    

                    

                    <div class="param-description">
                        <p>An array of CSS compatible color values. For example, ["#F00","#00F"] would define
a gradient drawing from red to blue.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">ratios</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array" class="crosslink external" target="_blank">Array</a></span>
                    

                    

                    <div class="param-description">
                        <p>An array of gradient positions which correspond to the colors. For example, [0.1,
0.9] would draw the first color to 10% then interpolating to the second color at 90%.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">x0</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Center position of the inner circle that defines the gradient.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y0</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Center position of the inner circle that defines the gradient.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">r0</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Radius of the inner circle that defines the gradient.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">x1</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Center position of the outer circle that defines the gradient.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y1</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Center position of the outer circle that defines the gradient.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">r1</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Radius of the outer circle that defines the gradient.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_rr" class="method item protected">
    <h3 class="name"><code>rr</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>x</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>w</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>h</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>radius</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    
        <span class="flag protected">protected</span>
    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1468"><code>rr:1468</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Shortcut to drawRoundRect.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">x</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">w</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">h</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                         
                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">radius</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Corner radius.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_rs" class="method item protected">
    <h3 class="name"><code>rs</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>colors</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>ratios</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>x0</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y0</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>r0</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>x1</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>y1</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code>r1</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    
        <span class="flag protected">protected</span>
    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1413"><code>rs:1413</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Shortcut to beginRadialGradientStroke.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">colors</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array" class="crosslink external" target="_blank">Array</a></span>
                    

                    

                    <div class="param-description">
                        <p>An array of CSS compatible color values. For example, ["#F00","#00F"] would define
a gradient drawing from red to blue.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">ratios</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array" class="crosslink external" target="_blank">Array</a></span>
                    

                    

                    <div class="param-description">
                        <p>An array of gradient positions which correspond to the colors. For example, [0.1,
0.9] would draw the first color to 10% then interpolating to the second color at 90%, then draw the second color
to 100%.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">x0</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Center position of the inner circle that defines the gradient.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y0</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Center position of the inner circle that defines the gradient.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">r0</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Radius of the inner circle that defines the gradient.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">x1</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Center position of the outer circle that defines the gradient.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">y1</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Center position of the outer circle that defines the gradient.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name">r1</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>Radius of the outer circle that defines the gradient.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_s" class="method item protected">
    <h3 class="name"><code>s</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>color</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    
        <span class="flag protected">protected</span>
    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1385"><code>s:1385</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Shortcut to beginStroke.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">color</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/String" class="crosslink external" target="_blank">String</a></span>
                    

                    

                    <div class="param-description">
                        <p>A CSS compatible color value (ex. "#FF0000", "red", or "rgba(255,0,0,0.5)"). Setting to
null will result in no stroke.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_sd" class="method item protected">
    <h3 class="name"><code>sd</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code class="optional">[segments]</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code class="optional">[offset=0]</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    
        <span class="flag protected">protected</span>
    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1372"><code>sd:1372</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Shortcut to setStrokeDash.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name optional">[segments]</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array" class="crosslink external" target="_blank">Array</a></span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>
                    

                    

                    <div class="param-description">
                        <p>An array specifying the dash pattern, alternating between line and gap.
For example, [20,10] would create a pattern of 20 pixel lines with 10 pixel gaps between them.
Passing null or an empty array will clear any existing dash.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name optional">[offset=0]</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>
                    

                    

                    <div class="param-description">
                        <p>The offset of the dash pattern. For example, you could increment this value to create a "marching ants" effect.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_setStrokeDash" class="method item">
    <h3 class="name"><code>setStrokeDash</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code class="optional">[segments]</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code class="optional">[offset=0]</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l731"><code>setStrokeDash:731</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Sets or clears the stroke dash pattern.</p>
<pre class="code prettyprint"><code>myGraphics.setStrokeDash([20, 10], 0);</code></pre>
<p>A tiny API method <code>sd</code> also exists.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name optional">[segments]</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array" class="crosslink external" target="_blank">Array</a></span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>
                    

                    

                    <div class="param-description">
                        <p>An array specifying the dash pattern, alternating between line and gap.
For example, <code>[20,10]</code> would create a pattern of 20 pixel lines with 10 pixel gaps between them.
Passing null or an empty array will clear the existing stroke dash.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name optional">[offset=0]</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>
                    

                    

                    <div class="param-description">
                        <p>The offset of the dash pattern. For example, you could increment this value to create a "marching ants" effect.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_setStrokeStyle" class="method item">
    <h3 class="name"><code>setStrokeStyle</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>thickness</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code class="optional">[caps=0]</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code class="optional">[joints=0]</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code class="optional">[miterLimit=10]</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code class="optional">[ignoreScale=false]</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l699"><code>setStrokeStyle:699</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Sets the stroke style. Like all drawing methods, this can be chained, so you can define
the stroke style and color in a single line of code like so:</p>
<pre class="code prettyprint"><code>myGraphics.setStrokeStyle(8,"round").beginStroke("#F00");</code></pre>
<p>A tiny API method "ss" also exists.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">thickness</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The width of the stroke.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name optional">[caps=0]</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/String" class="crosslink external" target="_blank">String</a> | <a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>
                    

                    

                    <div class="param-description">
                        <p>Indicates the type of caps to use at the end of lines. One of butt,
round, or square. Defaults to "butt". Also accepts the values 0 (butt), 1 (round), and 2 (square) for use with
the tiny API.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name optional">[joints=0]</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/String" class="crosslink external" target="_blank">String</a> | <a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>
                    

                    

                    <div class="param-description">
                        <p>Specifies the type of joints that should be used where two lines meet.
One of bevel, round, or miter. Defaults to "miter". Also accepts the values 0 (miter), 1 (round), and 2 (bevel)
for use with the tiny API.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name optional">[miterLimit=10]</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>
                    

                    

                    <div class="param-description">
                        <p>If joints is set to "miter", then you can specify a miter limit ratio which
controls at what point a mitered joint will be clipped.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name optional">[ignoreScale=false]</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Boolean" class="crosslink external" target="_blank">Boolean</a></span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>
                    

                    

                    <div class="param-description">
                        <p>If true, the stroke will be drawn at the specified thickness regardless
of active transformations.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_ss" class="method item protected">
    <h3 class="name"><code>ss</code></h3>

    
        <div class="args">
            <span class="paren">(</span><ul class="args-list inline commas">
            
                <li class="arg">
                    
                        <code>thickness</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code class="optional">[caps=0]</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code class="optional">[joints=0]</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code class="optional">[miterLimit=10]</code>
                    
                </li>
            
                <li class="arg">
                    
                        <code class="optional">[ignoreScale=false]</code>
                    
                </li>
            
            </ul><span class="paren">)</span>
        </div>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    
        <span class="flag protected">protected</span>
    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1352"><code>ss:1352</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Shortcut to setStrokeStyle.</p>

    </div>

    
        <div class="params">
            <h4>Parameters:</h4>

            <ul class="params-list">
            
                <li class="param">
                    
                        <code class="param-name">thickness</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                    

                    

                    <div class="param-description">
                        <p>The width of the stroke.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name optional">[caps=0]</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/String" class="crosslink external" target="_blank">String</a> | <a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>
                    

                    

                    <div class="param-description">
                        <p>Indicates the type of caps to use at the end of lines. One of butt,
round, or square. Defaults to "butt". Also accepts the values 0 (butt), 1 (round), and 2 (square) for use with
the tiny API.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name optional">[joints=0]</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/String" class="crosslink external" target="_blank">String</a> | <a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>
                    

                    

                    <div class="param-description">
                        <p>Specifies the type of joints that should be used where two lines meet.
One of bevel, round, or miter. Defaults to "miter". Also accepts the values 0 (miter), 1 (round), and 2 (bevel)
for use with the tiny API.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name optional">[miterLimit=10]</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>
                    

                    

                    <div class="param-description">
                        <p>If joints is set to "miter", then you can specify a miter limit ratio which
controls at what point a mitered joint will be clipped.</p>

                    </div>

                    
                </li>
            
                <li class="param">
                    
                        <code class="param-name optional">[ignoreScale=false]</code>
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Boolean" class="crosslink external" target="_blank">Boolean</a></span>
                        <span class="flag optional" title="This parameter is optional.">optional</span>
                    

                    

                    <div class="param-description">
                        <p>If true, the stroke will be drawn at the specified thickness regardless
of active transformations.</p>

                    </div>

                    
                </li>
            
            </ul>
        </div>
    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_store" class="method item">
    <h3 class="name"><code>store</code></h3>

    
        <span class="paren">()</span>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1083"><code>store:1083</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Stores all graphics commands so they won&#39;t be executed in future draws. Calling store() a second time adds to
the existing store. This also affects <code>drawAsPath()</code>.</p>
<p>This is useful in cases where you are creating vector graphics in an iterative manner (ex. generative art), so
that only new graphics need to be drawn (which can provide huge performance benefits), but you wish to retain all
of the vector instructions for later use (ex. scaling, modifying, or exporting).</p>
<p>Note that calling store() will force the active path (if any) to be ended in a manner similar to changing
the fill or stroke.</p>
<p>For example, consider a application where the user draws lines with the mouse. As each line segment (or collection of
segments) are added to a Shape, it can be rasterized using <a href="DisplayObject.html#method_updateCache" class="crosslink">updateCache</a>,
and then stored, so that it can be redrawn at a different scale when the application is resized, or exported to SVG.</p>
<pre class="code prettyprint"><code>// set up cache:
myShape.cache(0,0,500,500,scale);

// when the user drags, draw a new line:
myShape.graphics.moveTo(oldX,oldY).lineTo(newX,newY);
// then draw it into the existing cache:
myShape.updateCache("source-over");
// store the new line, so it isn&#39;t redrawn next time:
myShape.store();

// then, when the window resizes, we can re-render at a different scale:
// first, unstore all our lines:
myShape.unstore();
// then cache using the new scale:
myShape.cache(0,0,500,500,newScale);
// finally, store the existing commands again:
myShape.store();</code></pre>

    </div>

    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_toString" class="method item">
    <h3 class="name"><code>toString</code></h3>

    
        <span class="paren">()</span>
    

    
        <span class="returns-inline">
            <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/String" class="crosslink external" target="_blank">String</a></span>
        </span>
    

    

    

    

    

    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1160"><code>toString:1160</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Returns a string representation of this object.</p>

    </div>

    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/String" class="crosslink external" target="_blank">String</a></span>:
                    
                    <p>a string representation of the instance.</p>

                
            </div>
        </div>
    

    
</div>

                
                    <div id="method_unstore" class="method item">
    <h3 class="name"><code>unstore</code></h3>

    
        <span class="paren">()</span>
    

    
        <span class="returns-inline">
            <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>
        </span>
    

    

    

    

    

    
        <span class="flag chainable">chainable</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l1126"><code>unstore:1126</code></a>
        
        </p>


        

        
    </div>

    <div class="description">
        <p>Unstores any graphics commands that were previously stored using <a href="Graphics.html#method_store" class="crosslink">store</a>
so that they will be executed in subsequent draw calls.</p>

    </div>

    

    
        <div class="returns">
            <h4>Returns:</h4>

            <div class="returns-description">
                
                    
                        <span class="type"><a href="Graphics.html" class="crosslink">Graphics</a></span>:
                    
                    <p>The Graphics instance the method is called on (useful for chaining calls.)</p>

                
            </div>
        </div>
    

    
</div>

                
            </div>
        

        
            <div id="properties" class="api-class-tabpanel">
                <h2 class="off-left">Properties</h2>

                
                    <div id="property__activeInstructions" class="property item protected">
    <h3 class="name"><code>_activeInstructions</code></h3>
    <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array" class="crosslink external" target="_blank">Array</a></span>

    

    
        <span class="flag protected">protected</span>
    

    

    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l219"><code>_activeInstructions:219</code></a>
        
        </p>

        

        
    </div>

    <div class="description">
        <p>Uncommitted instructions.</p>

    </div>

    

    

    
</div>

                
                    <div id="property__commitIndex" class="property item protected">
    <h3 class="name"><code>_commitIndex</code></h3>
    <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>

    

    
        <span class="flag protected">protected</span>
    

    

    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l211"><code>_commitIndex:211</code></a>
        
        </p>

        

        
    </div>

    <div class="description">
        <p>Indicates the last instruction index that was committed.</p>

    </div>

    

    

    
</div>

                
                    <div id="property__ctx" class="property item protected">
    <h3 class="name"><code>_ctx</code></h3>
    <span class="type">CanvasRenderingContext2D</span>

    

    
        <span class="flag protected">protected</span>
    

    

    
        <span class="flag static">static</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l365"><code>_ctx:365</code></a>
        
        </p>

        

        
    </div>

    <div class="description">
        
    </div>

    

    

    
</div>

                
                    <div id="property__dirty" class="property item protected">
    <h3 class="name"><code>_dirty</code></h3>
    <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Boolean" class="crosslink external" target="_blank">Boolean</a></span>

    

    
        <span class="flag protected">protected</span>
    

    

    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l227"><code>_dirty:227</code></a>
        
        </p>

        

        
    </div>

    <div class="description">
        <p>This indicates that there have been changes to the activeInstruction list since the last updateInstructions call.</p>

    </div>

    
        <p><strong>Default:</strong> false</p>
    

    

    
</div>

                
                    <div id="property__fill" class="property item protected">
    <h3 class="name"><code>_fill</code></h3>
    <span class="type">Fill</span>

    

    
        <span class="flag protected">protected</span>
    

    

    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l197"><code>_fill:197</code></a>
        
        </p>

        

        
    </div>

    <div class="description">
        
    </div>

    

    

    
</div>

                
                    <div id="property__instructions" class="property item protected">
    <h3 class="name"><code>_instructions</code></h3>
    <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array" class="crosslink external" target="_blank">Array</a></span>

    

    
        <span class="flag protected">protected</span>
    

    

    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l204"><code>_instructions:204</code></a>
        
        </p>

        

        
    </div>

    <div class="description">
        
    </div>

    

    

    
</div>

                
                    <div id="property__oldStrokeDash" class="property item protected">
    <h3 class="name"><code>_oldStrokeDash</code></h3>
    <span class="type">StrokeDash</span>

    

    
        <span class="flag protected">protected</span>
    

    

    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l183"><code>_oldStrokeDash:183</code></a>
        
        </p>

        

        
    </div>

    <div class="description">
        
    </div>

    

    

    
</div>

                
                    <div id="property__oldStrokeStyle" class="property item protected">
    <h3 class="name"><code>_oldStrokeStyle</code></h3>
    <span class="type">StrokeStyle</span>

    

    
        <span class="flag protected">protected</span>
    

    

    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l169"><code>_oldStrokeStyle:169</code></a>
        
        </p>

        

        
    </div>

    <div class="description">
        
    </div>

    

    

    
</div>

                
                    <div id="property__storeIndex" class="property item protected">
    <h3 class="name"><code>_storeIndex</code></h3>
    <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Number" class="crosslink external" target="_blank">Number</a></span>

    

    
        <span class="flag protected">protected</span>
    

    

    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l236"><code>_storeIndex:236</code></a>
        
        </p>

        

        
    </div>

    <div class="description">
        <p>Index to draw from if a store operation has happened.</p>

    </div>

    
        <p><strong>Default:</strong> 0</p>
    

    

    
</div>

                
                    <div id="property__stroke" class="property item protected">
    <h3 class="name"><code>_stroke</code></h3>
    <span class="type">Stroke</span>

    

    
        <span class="flag protected">protected</span>
    

    

    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l155"><code>_stroke:155</code></a>
        
        </p>

        

        
    </div>

    <div class="description">
        
    </div>

    

    

    
</div>

                
                    <div id="property__strokeDash" class="property item protected">
    <h3 class="name"><code>_strokeDash</code></h3>
    <span class="type">StrokeDash</span>

    

    
        <span class="flag protected">protected</span>
    

    

    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l176"><code>_strokeDash:176</code></a>
        
        </p>

        

        
    </div>

    <div class="description">
        
    </div>

    

    

    
</div>

                
                    <div id="property__strokeIgnoreScale" class="property item protected">
    <h3 class="name"><code>_strokeIgnoreScale</code></h3>
    <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Boolean" class="crosslink external" target="_blank">Boolean</a></span>

    

    
        <span class="flag protected">protected</span>
    

    

    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l190"><code>_strokeIgnoreScale:190</code></a>
        
        </p>

        

        
    </div>

    <div class="description">
        
    </div>

    

    

    
</div>

                
                    <div id="property__strokeStyle" class="property item protected">
    <h3 class="name"><code>_strokeStyle</code></h3>
    <span class="type">StrokeStyle</span>

    

    
        <span class="flag protected">protected</span>
    

    

    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l162"><code>_strokeStyle:162</code></a>
        
        </p>

        

        
    </div>

    <div class="description">
        
    </div>

    

    

    
</div>

                
                    <div id="property_BASE_64" class="property item">
    <h3 class="name"><code>BASE_64</code></h3>
    <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object" class="crosslink external" target="_blank">Object</a></span>

    

    

    
        <span class="flag final">final</span>
    

    
        <span class="flag static">static</span>
    

    
        <span class="flag readonly">readonly</span>
    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l323"><code>BASE_64:323</code></a>
        
        </p>

        

        
    </div>

    <div class="description">
        <p>Map of Base64 characters to values. Used by <a href="Graphics.html#method_decodePath" class="crosslink">decodePath</a>.</p>

    </div>

    

    

    
</div>

                
                    <div id="property_beginCmd" class="property item">
    <h3 class="name"><code>beginCmd</code></h3>
    <span class="type"><a href="Graphics.BeginPath.html" class="crosslink">Graphics.BeginPath</a></span>

    

    

    

    
        <span class="flag static">static</span>
    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l314"><code>beginCmd:314</code></a>
        
        </p>

        

        
    </div>

    <div class="description">
        <p>A reusable instance of <a href="Graphics.BeginPath.html" class="crosslink">Graphics.BeginPath</a> to avoid
unnecessary instantiation.</p>

    </div>

    

    

    
</div>

                
                    <div id="property_command" class="property item">
    <h3 class="name"><code>command</code></h3>
    <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object" class="crosslink external" target="_blank">Object</a></span>

    

    

    

    

    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l140"><code>command:140</code></a>
        
        </p>

        

        
    </div>

    <div class="description">
        <p>Holds a reference to the last command that was created or appended. For example, you could retain a reference
to a Fill command in order to dynamically update the color later by using:</p>
<pre class="code prettyprint"><code>    var myFill = myGraphics.beginFill("red").command;
    // update color later:
    myFill.style = "yellow";</code></pre>

    </div>

    

    

    
</div>

                
                    <div id="property_instructions" class="property item">
    <h3 class="name"><code>instructions</code></h3>
    <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array" class="crosslink external" target="_blank">Array</a></span>

    

    

    

    

    
        <span class="flag readonly">readonly</span>
    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l398"><code>instructions:398</code></a>
        
        </p>

        

        
    </div>

    <div class="description">
        <p>Returns the graphics instructions array. Each entry is a graphics command object (ex. Graphics.Fill, Graphics.Rect)
Modifying the returned array directly is not recommended, and is likely to result in unexpected behaviour.</p>
<p>This property is mainly intended for introspection of the instructions (ex. for graphics export).</p>

    </div>

    

    

    
</div>

                
                    <div id="property_STROKE_CAPS_MAP" class="property item">
    <h3 class="name"><code>STROKE_CAPS_MAP</code></h3>
    <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array" class="crosslink external" target="_blank">Array</a></span>

    

    

    
        <span class="flag final">final</span>
    

    
        <span class="flag static">static</span>
    

    
        <span class="flag readonly">readonly</span>
    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l333"><code>STROKE_CAPS_MAP:333</code></a>
        
        </p>

        

        
    </div>

    <div class="description">
        <p>Maps numeric values for the caps parameter of <a href="Graphics.html#method_setStrokeStyle" class="crosslink">setStrokeStyle</a> to
corresponding string values. This is primarily for use with the tiny API. The mappings are as follows: 0 to
"butt", 1 to "round", and 2 to "square".
For example, to set the line caps to "square":</p>
<pre class="code prettyprint"><code> myGraphics.ss(16, 2);</code></pre>

    </div>

    

    

    
</div>

                
                    <div id="property_STROKE_JOINTS_MAP" class="property item">
    <h3 class="name"><code>STROKE_JOINTS_MAP</code></h3>
    <span class="type"><a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array" class="crosslink external" target="_blank">Array</a></span>

    

    

    
        <span class="flag final">final</span>
    

    
        <span class="flag static">static</span>
    

    
        <span class="flag readonly">readonly</span>
    

    <div class="meta">
        
            
                
                <p>
                
                Defined in
                
            
        
        
        <a href="../files/easeljs_display_Graphics.js.html#l349"><code>STROKE_JOINTS_MAP:349</code></a>
        
        </p>

        

        
    </div>

    <div class="description">
        <p>Maps numeric values for the joints parameter of <a href="Graphics.html#method_setStrokeStyle" class="crosslink">setStrokeStyle</a> to
corresponding string values. This is primarily for use with the tiny API. The mappings are as follows: 0 to
"miter", 1 to "round", and 2 to "bevel".
For example, to set the line joints to "bevel":</p>
<pre class="code prettyprint"><code> myGraphics.ss(16, 0, 2);</code></pre>

    </div>

    

    

    
</div>

                
            </div>
        

        

        
    </div>
</div>

                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="../assets/vendor/prettify/prettify-min.js"></script>
<script>prettyPrint();</script>
<script src="../assets/js/yui-prettify.js"></script>
<script src="../api.js"></script>
<script src="../assets/js/api-filter.js"></script>
<script src="../assets/js/api-list.js"></script>
<script src="../assets/js/api-search.js"></script>
<script src="../assets/js/apidocs.js"></script>
</body>
</html>
